<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8" />
  <title>CleanSlateCSS Demo 5</title>
  <!--<link rel="shortcut icon" type="image/ico" href="/favicon.ico" />-->
  <!--<link rel="stylesheet" href="http://cleanslatecss.googlecode.com/svn/trunk/cleanslate.css" type="text/css" />-->  
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
  <link rel="stylesheet" href="../cleanslate.css" type="text/css" />
  <!--[if lte IE 7]><link rel="stylesheet" type="text/css" href="../cleanslate_ie7.css" /><![endif]-->
  <link rel="stylesheet" href="stylesheets/demo.css" type="text/css" />
  <style>

	.cleanslate h1 {
		color: expression((function (_this) {
			window.setTimeout(function () {
				_this.setAttribute("style", "color:" +
					(_this.parentNode.currentStyle ?
						_this.parentNode.currentStyle.color : 'green') + " !important");
			}, 0);
			return _this.parentNode.currentStyle ?
				_this.parentNode.currentStyle.color : 'green';
		})(this));
	}

	.host h1 {
		color: #ff0000;
		direction: rtl;
		font-family: monospace;
		font-size: 18px;
		font-style: italic;
		font-weight: bolder;
		line-height: 2em;
		list-style-type: square;
		text-align: center;	
		text-decoration: line-through;
	}
	
	/*
	.cleanslate h1 {
		color:expression(this.parentNode.currentStyle ? this.parentNode.currentStyle.color: 'black');
		direction:expression(this.parentNode.currentStyle ? this.parentNode.currentStyle.direction: 'ltr');
		font-family:expression(this.parentNode.currentStyle ? this.parentNode.currentStyle.fontFamily: 'Arial');
		font-size:expression(this.parentNode.currentStyle ? this.parentNode.currentStyle.fontSize: 'medium');
		font-style:expression(this.parentNode.currentStyle ? this.parentNode.currentStyle.fontStyle: 'normal');
		font-weight:expression(this.parentNode.currentStyle ? this.parentNode.currentStyle.fontWeight: 'normal');
		line-height:expression(this.parentNode.currentStyle ? this.parentNode.currentStyle.lineHeight: 'normal');
		list-style-type:expression(this.parentNode.currentStyle ? this.parentNode.currentStyle.listStyeType: 'disc');
		text-align:expression(this.parentNode.currentStyle ? this.parentNode.currentStyle.textAlign: 'left');
		text-decoration:expression(this.parentNode.currentStyle ? this.parentNode.currentStyle.textDecoration: 'none');
	}
	*/
	
	
	
	
	
</style> 
</head>

<body>
  	<div id="intro">
    	<a href="http://code.google.com/p/cleanslatecss/">CleanSlate CSS</a>
    	<a href="1.html">Demo 1</a>
        <a href="2.html">Demo 2</a>
        <a href="3.html">Demo 3</a>
        <span>Demo 4</span>
  	</div>

  	<div class="host">
    	<div id="contents">
      		<div id="main-content">
   	    		<h1>Host content</h1>
      		</div>
      
      		<div id="sidebar"> 
        		<div class="cleanslate">
          			<h1>Cleanslated content</h1>
        		</div>
      		</div>
    	</div>
  	</div>
</body>
</html>